<style>
    /* 下拉上拉加载插件样式 */
    .refreshWrap .refresh{position: absolute;left: 0;top: 0;width: 100%;height:60px;line-height: 60px;text-align: center;}
    .refreshWrap .loadingBox{width: 100%;height:40px;text-align: center;padding: 10px;position: relative;background-color: #fff;z-index: 2}
    .refreshWrap .loading,.refreshWrap .loadTxt{vertical-align: middle;display: inline-block;}
    .refreshWrap .loading{border-radius: 50%;width: 16px;height: 16px;border: 1px solid #666;border-top-color: transparent;margin-right: 8px;transform: translateZ(0);position: relative;}
    .refreshWrap .noMore .loading{display:none;}
    .refreshWrap .success{border-color: transparent;}
    .refreshWrap .success:before{content:"";border:1px solid #666;border-top-color: transparent;border-left-color:transparent;position: absolute;left: 0;bottom: 0;width: 8px;height: 16px;}
    .refreshWrap .rotate {
        -webkit-animation: refresh-rotate 0.6s linear infinite;
        animation: refresh-rotate 0.6s linear infinite;
    }
    @keyframes refresh-rotate {
        0% {
            transform: rotateZ(0deg);
            -moz-transform: rotate(0deg);
        }
        100% {
            transform: rotateZ(360deg);
            -moz-transform: rotate(360deg);
        }
    }
</style>
<div class="CenterHeaderBox RollingGoal">
    <div class="CenterBackBtn"><a href="javascript:history.go(-1)"><img src="__CDN__/map/images/return.png" alt="返回"/></a></div>
    <div class="CenterHeaderTitle">我的分红</div>
</div>

<div class="CenterMain">
    <div class="ParticipationTop gradualBg">
        <p class="p1">{$mentioning}</p>
        <p class="p2">分红</p>
    </div>
    <div class="BalanceList">
        <div class="title">分红明细</div>
        <div class="BalanceDetail" style="position: absolute;width:100%;height: 140%;overflow-y:auto;-webkit-overflow-scrolling: touch;" >
            <ul id="ul">
            </ul>
        </div>

    </div>
</div>


<script type="text/javascript" src="__CDN__/assets/js/zepto.min.js"></script>
<script type="text/javascript" src="__CDN__/assets/js/PullToRefresh.min.js"></script>
<script>

    var n=0,flag=true;
    re_ajax(1)
    var refreshBox=new PullToRefresh({
        container:".BalanceDetail",
        pull:{
            callback:function(){
                setTimeout(function(){
                    n=0
                    re_ajax(n)
                    refreshBox.endPullRefresh(true)
                },1000)
            }
        },
        up:{
            callback:function(){

                setTimeout(function(){
                    n++
                    re_ajax(n)
                    refreshBox.endUpLoading(flag)

                },1000)
            }
        }
    })
    function re_ajax(page){
        $.ajax({
            type:"GET",
            url:"{$http_url}/index/user/dividend",
            dataType:"json",
            data:{
                page:page,

            },
            success:function(data){
                if(page==1||page==0){
                    $('#ul').html('');
                }
                var html='';
                data.data.forEach(function (v) {
                    html+='<li class="am-cf">';
                    html+='<div class="textL am-fl">';
                    html+='  <p class="p1"><span></span> 会员ID:'+v.user_id+'</p> ';
                    html+='  <p class="p2">'+v.createtime+'</p>';
                    html+='</div>';
                    html+='<div class="textR dmColor am-fr">+'+v.money+'</div>';
                    html+='</li>'

                })
                // $("#ul")[type](html)
                $('#ul').append(html);

                if(html==''){
                    flag=false;
                }
            },
            error:function(jqXHR){
                console.log("Error: "+jqXHR.status);
            }
        });
    }


</script>

